
'use strict';
(function(angular){
    var app = angular.module('cas',['ngRoute']);
    app.config(['$routeProvider',function($routeProvider){
        $routeProvider
        .when('/Canvas',{
            templateUrl:'cas/cas.html',
            controller:'casController'
        })
    }]);

    app.controller('casController',['$scope',function($scope){
        $scope.cas = document.querySelector('#cas');
        $scope.ctx = $scope.cas.getContext('2d');
        $scope.color = 'red';
        $scope.startAngle = -90;
        $scope.toAngle = function (radian){
            return radian * 180 / Math.PI;
        }
        $scope.toRadian = function (angle){
            return angle * 180 / Math.PI;
        }
        $scope.circle = function(){
            for ( var i = 0; i < 3; i++ ) {
                $scope.ctx.beginPath();
                $scope.ctx.fillStyle = $scope.color;
                $scope.ctx.moveTo( $scope.cas.width/2, $scope.cas.height/2 );
                $scope.ctx.arc( $scope.cas.width/2, $scope.cas.height/2, 75,
                    $scope.toRadian( $scope.startAngle ), $scope.toRadian( $scope.startAngle+=120 ) );
                $scope.ctx.fill();
            }
        }
    }]);
})(angular);